<template>
  <el-dialog
    :title="dialogData.dialogTitle"
    :visible.sync="dialogData.isVisibleCancel"
    class="dialogForm"
    width="500px"
    :before-close="handleClose"
  >
    <div class="unfreeze-form">
      <span>{{dialogData.msg}}</span>
    </div>
    <span
      slot="footer"
      class="dialog-footer"
    >
      <base-button
        class="unimportanceButton btnCancle"
        @click="handleClose"
      >取 消</base-button>
      <base-button
        class="minorImportantButton"
        type="primary"
        @click="handleSubmit"
      >确 定</base-button>
    </span>
  </el-dialog>
</template>
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator'
// 公用组件
// 按钮
import BaseButton from '@/components/base-button/index.vue'
// interface接口
// api接口

@Component({
  name: 'Dialog',
  components: {
    BaseButton
  }
})
export default class extends Vue {
  @Prop() private dialogData!: any

  // 提交数据
  private handleSubmit() {
    this.$emit('cancel')
    this.handleClose()
  }

  // 表单取消
  private handleClose() {
    this.dialogData.isVisibleCancel = false
    this.$emit('handleclose')
    this.$emit('clearselection')
  }
}
</script>
<style lang="scss">
</style>
